<template>
    <div class="index">
        <site-topbar></site-topbar>
        <site-header @search="handleSearch"></site-header>
        <site-category-list></site-category-list>
        <site-banner></site-banner>
        <site-daily-hot></site-daily-hot>
        <site-recommend></site-recommend>
        <site-brand></site-brand>
        <site-footer></site-footer>
    </div>
</template>

<script>
    import SiteHeader from '../public/SiteHeader'
    import SiteTopbar from '../public/SiteTopbar'
    import SiteCategoryList from '../index/SiteCategoryList'
    import SiteBanner from '../index/SiteBanner'
    import SiteDailyHot from '../index/SiteDailyHot'
    import SiteRecommend from '../index/SiteRecommend'
    import SiteBrand from '../index/SiteBrand'
    import SiteFooter from '../public/SiteFooter'

    export default {
        props: {},
        components: {
            'site-header': SiteHeader,
            'site-topbar': SiteTopbar,
            'site-category-list': SiteCategoryList,
            'site-banner': SiteBanner,
            'site-daily-hot': SiteDailyHot,
            'site-recommend': SiteRecommend,
            'site-brand': SiteBrand,
            'site-footer': SiteFooter
        },
        methods: {
            handleSearch(e) {
                this.$router.push({
                    name: 'search',
                    params: {
                        data: e.data
                    }
                })
            }
        }
    };
</script>
